<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
    <style>
        .container { width: 300px; margin: 100px auto; }
        input { margin: 5px 0; width: 100%; }
    </style>
</head>
<body>
<div class="container">
    <h2>用户注册</h2>
    <input type="text" id="name" placeholder="姓名"><br>
    <input type="text" id="number" placeholder="账号"><br>
    <input type="password" id="password" placeholder="密码"><br>
    <input type="email" id="email" placeholder="邮箱（可选）"><br>
    <button onclick="register()">注册</button>
    <button onclick="location.href='login.html'">返回登录</button>
    <p id="message"></p>
</div>

<script>
    async function register() {
        const account = {
            name: document.getElementById('name').value,
            number: document.getElementById('number').value,
            password: document.getElementById('password').value,
            email: document.getElementById('email').value
        };

        // 简单的前端校验
        if (!account.name || !account.number || !account.password) {
            document.getElementById('message').textContent = "姓名、账号和密码必须填写！";
            return;
        }

        const response = await fetch('/api/account/register', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify(account)
        });

        const result = await response.json();
        if (result.success) {
            document.getElementById('message').textContent = "注册成功！正在跳转...";
            setTimeout(() => {
                window.location.href = 'login.html';
            }, 1500);
        } else {
            document.getElementById('message').textContent = result.message || "注册失败！";
        }
    }
</script>
</body>
</html>